<!DOCTYPE html>
<html>
<head>
	<title>菜单管理</title>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
	<link rel="stylesheet" href="/static/layui/css/layui.css?t=1510415843040" media="all"> 
	<link rel="stylesheet" href="/static/zTree/css/metroStyle/metroStyle.css" type="text/css">
	<script src="/static/layui/layui.all.js"></script>
	<script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
	<script type="text/javascript" src="/static/zTree/js/jquery.ztree.core.js"></script>
	<script src="/static/js/webutil.js?t=123"></script>
</head>
<body>
<div class="layui-fluid">
	<div class="layui-row">
		<fieldset class="layui-elem-field layui-field-title">
	  		<legend>菜单管理</legend>
		</fieldset>
		<div class="layui-col-md3">
			<fieldset class="layui-elem-field">
				<legend>菜单</legend>
				<div class="layui-field-box">
					<ul id="menuTree" class="ztree"></ul>
				</div>
			</fieldset>
			<script type="text/javascript">
			var treeObj = null;
			var setting = {
					view: {
						showIcon: true
					},
				data: {
					simpleData: {
						enable: true
					}
				},
				callback: {
					onClick:function(event, treeId, treeNode, clickFlag) {
						location.href=location.origin+location.pathname+"?id="+treeNode.id;
					}
				}
			};

			var zNodes =[
				<#list list as sysMenu>
				{id:'${sysMenu.id}', pId:'${sysMenu.pid}', name:"${sysMenu.name}(排序:${sysMenu.sort})", open:true,clickFlag:1},
				</#list>
			];

			$(document).ready(function(){
				treeObj = $.fn.zTree.init($("#menuTree"), setting, zNodes);
				var node = treeObj.getNodeByParam("id", "${menu.id}");
			    treeObj.selectNode(node);
			});
		</script>
	    </div>
	    <div class="layui-col-md9">
	    
	    <fieldset class="layui-elem-field">
			<legend>${menu.name}-编辑</legend>
			<div class="layui-field-box">
				<form class="layui-form" id="currentMenuForm" action="">
				  <input type="hidden" name="id" value="${menu.id!''}">
				  <input type="hidden" name="pid" value="${menu.pid!''}">
				  <input type="hidden" name="pids" value="${menu.pids!''}">
				  <input type="hidden" name="level" value="${menu.level!''}">
				  <input type="hidden" name="leafflag" value="${menu.leafflag!''}">
				  
				  <div class="layui-form-item">
				    <label class="layui-form-label">名称</label>
				    <div class="layui-input-block">
				      <input type="text" name="name" value="${menu.name!''}" lay-verify="required" class="layui-input">
				    </div>
				  </div>
				  <div class="layui-form-item">
				    <label class="layui-form-label">链接</label>
				    <div class="layui-input-block">
				      <input type="text" name="url" value="${menu.url!''}" class="layui-input">
				    </div>
				  </div>
				  <div class="layui-form-item">
				    <label class="layui-form-label">权限</label>
				    <div class="layui-input-block">
				      <input type="text" name="permission" value="${menu.permission!''}" class="layui-input">
				    </div>
				  </div>
				  <div class="layui-form-item">
				    <label class="layui-form-label">图标</label>
				    <div class="layui-input-block">
				    	<input type="hidden" id="menu_icon_hidden" name="icon" value="<#if menu.icon??>${menu.icon?html}</#if>" class="layui-input">
				    	<button class="layui-btn  layui-btn-primary" type="button"><i class="layui-icon" id="menu_icon">${menu.icon!''}</i></button>
				      	<button class="layui-btn" type="button" onclick="selectIcon('menu_icon')">选择图标</button>
				    </div>
				  </div>
				  <div class="layui-form-item">
				    <label class="layui-form-label">排序</label>
				    <div class="layui-input-block">
				      <input type="text" name="sort" value="${menu.sort!''}" lay-verify="required" class="layui-input">
				    </div>
				  </div>
				  <div class="layui-form-item">
				    <label class="layui-form-label">是否展示</label>
				    <div class="layui-input-block">
				      <input type="radio" name="showflag" value="1" title="是" checked>
					  <input type="radio" name="showflag" value="0" title="否" <#if menu.showflag=='0'>checked</#if>>
				    </div>
				  </div>
				  <div class="layui-form-item">
				    <div class="layui-input-block">
				      <button class="layui-btn" lay-submit lay-filter="currentMenu">保存修改</button>
				      <button class="layui-btn layui-btn-normal" type="button" onclick="addChild('${menu.id}')">添加下级</button>
				      <button class="layui-btn layui-btn-danger" type="button" onclick="deleteData(deleteUrl,'${menu.id}')">删除</button>
				    </div>
				  </div>
				</form>
			</div>
		</fieldset>
	    </div>
	    
	   	 
	</div>
</div>
<script type="text/javascript">
	layui.form.render();
	var postUrl="/base/sysmenu/save.json";
	var deleteUrl = "/base/sysmenu/deleteWithChildren.json";
	var formUrl = "/base/sysmenu/form.htm";
	
	function addChild(id){
		openLayer('/base/sysmenu/addChildform.htm?id=' + id, '添加子菜单');
	}
	
	function selectIcon(id){
		openLayer('/base/sysmenu/selectIcon.htm?id='+id, '选择图标');
	}
	
	layui.form.on('submit(currentMenu)', function(formData) {
		postData(postUrl,'currentMenuForm',function(){
			location.reload();
		});
		return false;
	});
	
	layui.form.on('submit(childMenu)', function(formData) {
		postData(postUrl,'childMenuForm',function(){
			location.reload();
		});
		return false;
	});
</script>
</body>
</html>